<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>运单快速录入</title>
		<!-- 导入jquery核心类库 -->
		<script type="text/javascript" src="../../js/jquery-1.8.3.js"></script>
		<!-- 导入easyui类库 -->
		<link rel="stylesheet" type="text/css" href="../../js/easyui/themes/default/easyui.css">
		<link rel="stylesheet" type="text/css" href="../../js/easyui/themes/icon.css">
		<link rel="stylesheet" type="text/css" href="../../js/easyui/ext/portal.css">
		<link rel="stylesheet" type="text/css" href="../../css/default.css">
		<script type="text/javascript" src="../../js/easyui/jquery.easyui.min.js"></script>
		<script type="text/javascript" src="../../js/easyui/ext/jquery.portal.js"></script>
		<script type="text/javascript" src="../../js/easyui/ext/jquery.cookie.js"></script>
		<script src="../../js/easyui/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>
		<script type="text/javascript">
			var editIndex ;
			
			function doAdd(){
				if(editIndex != undefined){
					$("#grid").datagrid('endEdit',editIndex);
				}
				if(editIndex==undefined){
					//alert("快速添加电子单...");
					$("#grid").datagrid('insertRow',{
						index : 0,
						row : {}
					});
					$("#grid").datagrid('beginEdit',0);
					editIndex = 0;
				}
			}
			
			function doSave(){
				$("#grid").datagrid('endEdit',editIndex );
			}
			
			function doCancel(){
				if(editIndex!=undefined){
					$("#grid").datagrid('cancelEdit',editIndex);
					if($('#grid').datagrid('getRows')[editIndex].id == undefined){
						$("#grid").datagrid('deleteRow',editIndex);
					}
					editIndex = undefined;
				}
			}
			
			//工具栏
			var toolbar = [ {
				id : 'button-add',	
				text : '新增一行',
				iconCls : 'icon-edit',
				handler : doAdd
			}, {
				id : 'button-cancel',
				text : '取消编辑',
				iconCls : 'icon-cancel',
				handler : doCancel
			}, {
				id : 'button-save',
				text : '保存',
				iconCls : 'icon-save',
				handler : doSave
			},{
				id : 'button-search',
				text : '查询',
				iconCls : 'icon-search',
				handler : doSearch
			}];
			// 定义列
			var columns = [ [ {
				field : 'wayBillNum',
				title : '工作单号',
				width : 120,
				align : 'center',
				editor :{
					type : 'validatebox',
					options : {
						required: true
					}
				}
			}, {
				field : 'arriveCity',
				title : '到达地',
				width : 120,
				align : 'center',
				editor :{
					type : 'validatebox',
					options : {
						required: true
					}
				}
			},{
				field : 'goodsType',
				title : '托寄物类型',
				width : 120,
				align : 'center',
				editor :{
					type : 'validatebox',
					options : {
						required: true
					}
				}
			}, {
				field : 'num',
				title : '件数',
				width : 120,
				align : 'center',
				editor :{
					type : 'numberbox',
					options : {
						required: true
					}
				}
			}, {
				field : 'weight',
				title : '重量',
				width : 120,
				align : 'center',
				editor :{
					type : 'validatebox',
					options : {
						required: true
					}
				}
			}, {
				field : 'floadreqr',
				title : '配载要求',
				width : 220,
				align : 'center',
				editor :{
					type : 'validatebox',
					options : {
						required: true
					}
				}
			}] ];
			
			$(function(){
				// 先将body隐藏，再显示，不会出现页面刷新效果
				$("body").css({visibility:"visible"});
				
			
			// 运单数据表格
				$('#grid').datagrid({
					iconCls : 'icon-forward',
					fit : true,
					border : true,
					rownumbers : true,
					striped : true,
					//pageList : [ 30, 50, 100 ],
					pageList : [ 2, 20, 200 ],
					pagination : true,
					toolbar : toolbar,
					url : "../../wayBill_pageList.action",
					idField : 'id',
					columns : columns,
					onDblClickRow : doDblClickRow,
					onAfterEdit : function(rowIndex, rowData, changes) {
						console.info(rowData);

						$.post("../../wayBill_quickadd.action", rowData, function(data) {
							//data:结果
							//最后一个参数，结果转换类型：可以写json，
							//也可以不写，需要在
							//response.setContext("applicaton/json;charts=u8")
							//console.log(data);
							if(data.result){
								//保存成功
								$.messager.show({  	
								  title:'恭喜',  	
								  msg:'保存运单成功！',  	
								  timeout:2000 	
								});  

							}else{
								//保存失败
								$.messager.alert("失败","保存运单失败！","error");
							}
							//刷新列表
							$("#grid").datagrid("reload");
						});
						//编辑结束后，将正在编辑的索引置为未定义
						editIndex = undefined;
					}
				});
			});

			function doDblClickRow(rowIndex, rowData) {
				//alert("双击表格数据...");
				console.info(rowIndex);
				$('#grid').datagrid('beginEdit', rowIndex);
				editIndex = rowIndex;
			}
			//弹出查询框
			function doSearch(){
				
				//模式窗口
				$("#searchWindow").window({
					modal:true
				});
				//弹出window
				$("#searchWindow").window("open");
				
			}
			function sedSearch(value,name){
				///alert(value+"----"+name)
				//重新查询数据
				$("#grid").datagrid("load",{
					//自定义两个属性，分别存放关键字和菜单名字
					"fieldName":name,
					"fieldValue":value
				});
			}
		</script>
	</head>
		
	<body class="easyui-layout" style="visibility:hidden;">
		<!-- 搜索框 -->
		<div region="north">
			<input class="easyui-searchbox"
			data-options="prompt:'请输入要搜索的关键字',menu:'#mm',searcher:sedSearch"/>
		
		<!-- 菜单 -->
		<div id="mm">
			<div name="arriveCity" data-options="iconCls:'icon-ok'">到达地</div>
			<div name="goodsType">托寄物类型</div>
		</div>
		</div>
		<div region="center" border="false">
			<table id="grid"></table>
		</div>
		<!-- 查询订单-->
		<div class="easyui-window" title="查询订单窗口" closed="true" id="searchWindow" collapsible="false" minimizable="false" maximizable="false" style="width: 400px; top:40px;left:200px">
			<div style="overflow:auto;padding:5px;" border="false">
				<form id="searchForm">
					<table class="table-edit" width="80%" align="center">
						<tr class="title">
							<td colspan="2">查询条件</td>
						</tr>
						<tr>
							<td>工作单号</td>
							<td>
								<input type="text" name="wayBillNum" />
							</td>
						</tr>
						<tr>
							<td colspan="2"><a id="searchBtn" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'">查询</a> </td>
						</tr>
					</table>
				</form>
			</div>
		</div>
	</body>

</html> 